<template>
  <div class="card_box">
    <el-menu
      :default-active="activeIndex"
      class="el-menu-demo"
      mode="horizontal"
      @select="handleSelect"
    >
      <!-- <router-link :to="{ name: 'login' }"> -->
      <el-menu-item index="1">登录</el-menu-item>
      <!-- </router-link> -->
      <!-- <router-link :to="{ name: 'register' }"> -->
      <el-menu-item index="2" id="register" >注册</el-menu-item>
      <!-- </router-link> -->
    </el-menu>
  </div>
</template>

<script>
export default {
  data() {
    return {
      activeIndex: "1"
    };
  },
  mounted: function() {
    console.log(this.$route.params.activeIndex);
    if(this.$route.params.activeIndex == 2){
      document.getElementById("register").click()
    }
  },
  methods: {
    handleSelect(key, keyPath) {
      console.log(key, keyPath);
      if (key == 1) {
        this.$router.push({ name: "login", params: { activeIndex: "1" } });
      } else {
        this.$router.push({ name: "register", params: { activeIndex: "2" } });
      }
    }
  }
};
</script>

<style>
.search_box {
  padding-top: 2%;
}
.card_box {
  padding-left: 30%;
  margin-bottom: 10%;
}
.el-menu.el-menu--horizontal {
  border-bottom: 0px !important;
}
</style>
